@for $i from 0 through 500 {
    .w#{$i} {
        width: #{$i}px;
    }

    .h#{$i} {
        height: #{$i}px;
    }
}

@for $i from 0 through 100 {
    .w#{$i}p {
        width: #{$i}#{"%"};
    }

    .h#{$i}p {
        height: #{$i}#{"%"};
    }
}

.w-max-content {
    width: max-content;
}

.h-max-content {
    height: max-content;
}

.w-unset {
    width: unset;
}

.h-unset {
    height: unset;
}

.border-box {
    box-sizing: border-box;
}

.content-box {
    box-sizing: content-box;
}

.overflow-hidden {
    overflow: hidden;
}